import React    from 'react';
import ReactDOM from 'react-dom';
import MyDateRange  from './myDateRange';
import  './dateRange.scss';

var CommentBox = React.createClass({
  getInitialState () {
    return {
      startDate: '',
      endDate: ''
    }
  },
  //时间返回选择工具回调函数，返回开始时间和结束时间
  onscallback(_date) {
    if (!!_date) {
      this.state.startDate = _date.startTime || _date.startDate;
      this.state.endDate = _date.endDate || _date.endTime;
    }
  },

  render: function() {
    return (
      <div className="commentBox">
      你好，我是测试，我是一个jquery的时间范围选择工具
      <MyDateRange onscallback={this.onscallback.bind(this)}></MyDateRange>   
      <div>开始时间：{this.state.startDate}</div>
      <div>结束时间：{this.state.endDate}</div>     
      </div>
    );
    }
});

ReactDOM.render(
    <CommentBox />,
    document.getElementById('app')
);
